<template>
	<view>
		<Header :title="'选择蜂箱'"></Header>
		<view class="cardList">
			<view class="cardItem" v-for="item in list">
				<image class="cardPic" :src="item.imgUrl" mode="aspectFill"></image>
				<view class="name">
					{{item.name}}{{item.number}}
				</view>
				<view class="price">
					￥{{item.money}}
				</view>
				<view class="day">
					每月饲料费用：{{item.rearMonthMoney}}
				</view>
				<view class="giveBtn" @click="song(item)">
					赠送
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import Header from '@/components/header/header.vue'
	export default {
		data() {
			return {
				UserId: '',
				list: [],
				nickName: ''
			}
		},
		onLoad(e) {
			this.UserId = e.userId
			this.nickName = e.nickName
			this.cread()
		},
		methods: {
			async song(e) {
				let that = this 
				uni.showModal({
					title: '提示',
					content: '确定赠送给' + that.nickName,
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮的文字  
					showCancel: true, // 是否显示取消按钮，默认为 true
					confirmColor: '#f55850',
					cancelColor: '#39B54A',
					success: (re) => {
						if (re.confirm) {
							//转赠他人
							that.$api.request('manage/presented/client', 'post', {
								fosterId: e.id,
								byPresentedUserId: that.UserId
							}).then((res) => {
								if (res.code == 200) {
									uni.showToast({
										title: '赠送成功',
										icon: 'none'
									})
									setTimeout(()=>{
										uni.redirectTo({
											url: '/pages/givePresent/givePresent'
										})
									},1000)
									
								}
							})
						} else {
							console.log('cancel') //点击取消之后执行的代码
						}
					}
				})



			},
			async cread() {
				let res = await this.$api.request('farmer/foster/user/adopt/ist')
				this.list = res.data.list
			}
		},
		components: {
			Header
		}
	}
</script>

<style lang="scss" scoped>
	.cardList {
		display: flex;
		width: 100%;
		padding: 30rpx 80rpx;
		flex-wrap: wrap;
		justify-content: space-between;
		box-sizing: border-box;

		.cardItem {
			width: 267rpx;
			background: #F7F8FC;
			box-shadow: 0rpx 7rpx 8rpx 0rpx rgba(153, 153, 153, 0.3);
			border-radius: 20rpx;
			display: flex;

			flex-direction: column;
			padding: 23rpx 32rpx 20rpx 32rpx;
			box-sizing: border-box;
			margin-bottom: 35rpx;

			.cardPic {
				width: 100%;
				height: 203rpx;
				margin-bottom: 21rpx;
			}

			.name {
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #333333;
				margin-bottom: 24rpx;
			}

			.price {
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #DC1010;
				margin-bottom: 24rpx;
			}

			.day {
				margin-bottom: 33rpx;
				font-size: 26rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #666666;
			}

			.giveBtn {
				width: 143rpx;
				height: 53rpx;
				background: #E8220F;
				border-radius: 27rpx;
				font-size: 30rpx;
				font-family: PingFang SC;
				font-weight: 400;
				color: #FFFFFF;
				text-align: center;
				line-height: 53rpx;
				margin: 0 auto;
			}
		}
	}
</style>